<template>
  <div class="header">
    <van-search v-model="value" show-action placeholder="搜索商品、品类"  @search="onSearch">
      <template #left>
          <div class="city" @click="onCity">{{cityStore.city}}<span class="iconfont icon-jiantouxia"></span></div>
      </template>
      <template #action>
        <div @click="onClickButton">搜索</div>
      </template>
    </van-search>
  </div>
</template>
<script setup lang="ts">
import {ref} from "vue";
import {useRouter} from "vue-router";
import {useCityStore} from "@/store/City";

const value=ref<string>("")
const router=useRouter()
const cityStore=useCityStore()
//搜索
const onSearch = (val:string) => {
  console.log(val);
}
//城市切换
const onCity = () => {
    router.push("/city")
}
//搜索按钮
const onClickButton = () => {

}
</script>

<style scoped lang="less">
.city{
  margin-right: 5px;
  span{
    font-size: 10px;
    margin: 0 3px;
  }
}
</style>